/*
 * @Description:
 * @Author: Zzt
 * @Date: 2023-02-20 18:04:23
 * @LastEditTime: 2023-02-28 15:40:16
 */
import Editor from '@/components/BundledEditor';
import { Form, Input, Select } from 'antd';
import classNames from 'classnames/bind';
import { useAnnouncementMgtContext } from '../../contexts/AnnouncementMgtContext';
import styles from '../../styles/channel.module.scss';

const cx = classNames.bind(styles);

const AnnounceForm = (props: any) => {
  const { data, view } = props;
  const { channelList } = useAnnouncementMgtContext();
  console.log('channeList', channelList);

  return (
    <>
      <Form.Item name={'title'} label="公告标题" rules={[{ required: true }]}>
        <Input placeholder="请填写文章标题" />
      </Form.Item>
      <Form.Item name={'noticeTypeId'} label="所属频道" rules={[{ required: true }]}>
        <Select
          placeholder="=请选择="
          options={channelList}
          fieldNames={{
            label: 'name',
            value: 'id'
          }}
        />
      </Form.Item>
      <Form.Item name={'author'} label="作者" rules={[{ required: true }]}>
        <Input placeholder="请填写作者，默认（不填）为当前用户" />
      </Form.Item>
      <Form.Item label="状态" required={true}>
        {'待发布'}
      </Form.Item>
      <hr />
      {/* TODO 待商酌 */}
      <Form.Item name={'content'} label="内容">
        {view ? (
          <div className={cx('content-view')}>
            <span dangerouslySetInnerHTML={{ __html: data.content }}></span>
          </div>
        ) : (
          <Editor data={data?.content} view={view} />
        )}
      </Form.Item>
    </>
  );
};
export default AnnounceForm;
